import React, { useEffect } from 'react'
import { useSelector, useDispatch } from "react-redux"
import { action, action2,action3 } from "@/redux/actions"
import useRequest from "@/hooks/useRequest"
// import wangEdit from "xxx"

export default function Main() {
  /**
   * 获取仓库数据
   */
  const data = useSelector(state => {
    return state
  })
  const dispatch = useDispatch()
  const {getUsers} = useRequest()

  useEffect(() => {
    console.log(data);
  }, [])

  const decrement = () => {
    dispatch(action2(5))
  }
  const increment = () => {
    dispatch(action(10))
  }

  const changeName = () => {
    dispatch(action3("小王八"))
  }

  const fetchData = ()=>{
    getUsers((value)=>{
      console.log(value);
    })
  }

  const msg = (value)=>{
    // <div> <p style="color:red">蜗牛</p> </div>
  }


  return (
    <div>
      <h3>Main</h3>
      <h4>count:</h4>
      <p>{data.CountStore.count}</p>
      <button onClick={decrement}>-</button>
      <button onClick={increment}>+</button>
      <h4>user:</h4>
      <p>{data.UserStore.user.name}</p>
      <button onClick={changeName}>修改name</button>
      <p>{data.UserStore.users.length}</p>
      <button onClick={fetchData}>获取用户数据</button>
      {/* <wangEdit onChange={msg}></wangEdit> */}
    </div>
  )
}
